/*
 * Donut Chart
 */
.charts-css {

  &.donut {

    // Layout
    tbody {
      @include circle();

      background-color: var(--chart-bg-color);

      tr {
        display: none;
      }

      &::after {
        content: "";

        // Center the donut
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);

        // Donut size
        width: var(--donut-inner-size, 50%);
        height: var(--donut-inner-size, 50%);

        display: flex;
        justify-content: center;
        align-items: center;

        border-radius: 50%;
        background-color: var(--donut-inner-color, #fff);
      }
    }
  }

}
